import React from 'react'
import './style.scss'
import { Button, Form, Input, InputNumber, message } from 'antd'
import { addParkingTypeRequest } from '@/apis/parkingType';
import { layout } from '@/utils/contants';
import { storeAll } from '@/store';

const tailLayout = {
	wrapperCol: { offset: 8, span: 16 },
};

const AddParkingType: React.FC = () => {
	const [form] = Form.useForm()
	const onFinish = (value: any) => {
		addParkingTypeRequest(value).then((res: any) => {
			message.success(res.message)
			form.resetFields()
			storeAll.parkingLotTypeStore.getParkingLotTypeRequest()
		})
	}
	return <div className="addParkingTypeWrap">
		<Form {...layout} form={form} onFinish={onFinish}>
			<Form.Item label="一小时内价格" name="startNum" rules={[{ required: true, message: '请输入一小时内价格' }]}>
				<InputNumber />
			</Form.Item>
			<Form.Item label="一小时后每小时价格" name="hourNum" rules={[{ required: true, message: '请输入一小时后每小时价格' }]}>
				<InputNumber />
			</Form.Item>
			<Form.Item label="一天的价格" name="dayNum" rules={[{ required: true, message: '请输入一天的价格' }]}>
				<InputNumber />
			</Form.Item>
			<Form.Item label="一月的价格" name="monthNum" rules={[{ required: true, message: '请输入一月的价格' }]}>
				<InputNumber />
			</Form.Item>
			<Form.Item label="备注" name="notes" rules={[{ required: true, message: '请输入备注' }]}>
				<Input />
			</Form.Item>
			<Form.Item {...tailLayout}>
				<Button type="primary" htmlType="submit">
					添加
				</Button>
				<Button htmlType="button" onClick={() => form.resetFields()}>
					重置
				</Button>
			</Form.Item>
		</Form>
	</div>
}

export default AddParkingType